import {
  createRouter,
  createWebHashHistory,
  type RouteRecordRaw,
} from "vue-router";

import MainLayout from "@/layouts/MainLayout.vue";
import MyLayout from "@/layouts/MyLayout.vue";

import Home from "@/pages/Home.vue";
import Login from "@/pages/Login.vue";
import Blog from "@/pages/Blog.vue";
import Blogs from "@/pages/Blogs.vue";
import Tags from "@/pages/Tags.vue";
import TagDetails from "@/pages/TagDetails.vue";
import Authors from "@/pages/Authors.vue";
import AuthorDetails from "@/pages/AuthorDetails.vue";
import About from "@/pages/About.vue";

//
import { useUserStore } from "@/stores/user";

// routes
const routes: RouteRecordRaw[] = [
  {
    path: "/",
    name: "index",
    component: MainLayout,
    redirect: { name: "home" },
    children: [
      {
        path: "",
        name: "home",
        component: Home,
      },
      {
        path: "login",
        name: "login",
        component: Login,
      },
      {
        path: "blog",
        name: "blogs",
        component: Blogs,
      },
      {
        path: "blog/:id",
        name: "blog-detail",
        component: Blog,
      },
      {
        path: "tags",
        name: "tags",
        component: Tags,
      },
      {
        path: "tag/:id",
        name: "tag-details",
        component: TagDetails,
      },
      {
        path: "authors",
        name: "authors",
        component: Authors,
      },
      {
        path: "authors/:id",
        name: "author-details",
        component: AuthorDetails,
      },
      {
        path: "privacy",
        name: "privacy",
        component: () => import("@/pages/Privacy.vue"),
      },
      {
        path: "about",
        name: "about",
        component: About,
      },
    ],
  },
  {
    path: "/my",
    component: MyLayout,
    redirect: { name: "my.index" },
    children: [
      {
        path: "index",
        name: "my.index",
        component: () => import("@/pages/my/index.vue"),
      },
      {
        path: "new",
        name: "my.new-post",
        component: () => import("@/pages/my/NewPost.vue"),
      },
      {
        path: "edit/:id",
        name: "my.edit-post",
        component: () => import("@/pages/my/EditPost.vue"),
      },
      {
        path: "tags",
        name: "my.tags",
        component: () => import("@/pages/my/Tags.vue"),
      },
      {
        path: "resume",
        name: "my.resume",
        component: () => import("@/pages/my/Resume.vue"),
      },
    ],
  },
];
// 实例化路由
const router = createRouter({
  history: createWebHashHistory(),
  routes,
  scrollBehavior(_to, _from, savedPosition) {
    if (savedPosition) {
      return savedPosition;
    } else {
      return { top: 0 };
    }
    // return new Promise((resolve) => {
    //   if (savedPosition) {
    //     resolve(savedPosition);
    //   } else {
    //     if (from.meta.saveScrollTop) {
    //       from.meta.scrollTop =
    //         document.body.scrollTop || document.documentElement.scrollTop;
    //     }
    //     if (to.meta.saveScrollTop) {
    //       return resolve({ top: (to.meta.scrollTop as number) ?? 0 });
    //     }
    //     resolve({ top: 0 });
    //   }
    // });
  },
});

// 路由守卫
router.beforeEach((to) => {
  const userStore = useUserStore();
  // 如果用户已经登录则不允许进入登录
  // if (to.name == "login" && userStore.isLogin) {
  //   return false;
  // }
  // 如果要进入 my 页面则必须登录
  if ((to.name as string).startsWith("my") && !userStore.isLogin) {
    return { name: "login" };
  }
});

export default router;
